import { StyleSheet } from "react-native";
import { Dimensions } from "react-native";
const screenWidth = Dimensions.get("window").width;
const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  topSection: {
    alignItems: "center",
    padding: 20,
    paddingBottom: 15,
    borderBottomWidth: 0,
  },
  avatarWrapper: {
    position: "relative",
    marginRight: 15,
    borderRadius: 10, // 圆形边框，宽度和高度的一半
  },
  avatar: {
    width: 80,
    height: 80,
    borderRadius: 10,
  },
  statusDot: {
    width: 12,
    height: 12,
    borderRadius: 6,
    position: "absolute",
    right: 0,
    bottom: 0,
    borderWidth: 1.5,
    borderColor: "#fff",
  },
  profileHeader: {
    flexDirection: "row",
    alignItems: "center",
    paddingVertical: 20,
    paddingHorizontal: 20,
    width: "100%",
  },
  profileInfo: {
    marginLeft: 0,
    flex: 1,
  },
  nickname: {
    fontSize: 22,
    fontWeight: "500",
    marginBottom: 6,
  },
  signature: {
    fontSize: 14,
  },
  statusRow: {
    flexDirection: "row",
    justifyContent: "space-between",
    alignItems: "center",
    marginTop: 4,
  },
  statusText: {
    fontSize: 12,
    fontWeight: "500",
  },
  headerContainer: {
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "space-between",
    width: "100%",
    paddingHorizontal: 20,
    paddingTop: 10,
    paddingBottom: 10,
  },
  backButton: {
    padding: 5,
  },
  settingsButton: {
    padding: 5,
  },
  infoCard: {
    marginTop: 10,
    borderRadius: 8,
    overflow: "hidden",
    marginHorizontal: 10,
    width: screenWidth - 20,
    alignSelf: "center",
  },
  idRow: {
    flexDirection: "row",
    alignItems: "center",
  },
  wechatId: {
    fontSize: 14,
    marginRight: 15,
  },
  region: {
    fontSize: 14,
  },
  infoSection: {
    width: "100%",
  },
  infoItem: {
    flexDirection: "row",
    justifyContent: "space-between",
    alignItems: "center",
    paddingVertical: 18,
    paddingHorizontal: 20,
    borderBottomWidth: StyleSheet.hairlineWidth,
  },
  infoLabel: {
    fontSize: 16,
  },
  infoValue: {
    fontSize: 16,
  },
  borderBottom: {
    borderBottomWidth: StyleSheet.hairlineWidth,
  },
  sectionSeparator: {
    height: 10,
  },
  actionSection: {
    position: "absolute",
    bottom: 20,
    left: 0,
    right: 0,
    flexDirection: "row",
    justifyContent: "space-between",
    paddingHorizontal: 20,
  },
  actionButton: {
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "center",
    borderRadius: 6,
    paddingVertical: 15,
    marginBottom: 15,
  },
  messageButton: {
    flex: 1,
    marginLeft: 10,
    backgroundColor: "#4080ff",
  },
  videoButton: {
    flex: 1,
    marginRight: 10,
    backgroundColor: "#ffffff",
    borderWidth: 1,
    borderColor: "#e0e0e0",
  },
  buttonText: {
    fontSize: 16,
    fontWeight: "500",
    marginLeft: 10,
  },
  clickableRow: {
    flexDirection: "row",
    alignItems: "center",
  },
  arrowIcon: {
    marginLeft: 5,
  },
});
export default styles;
